<div class="modal-header">
	<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
		<li class="fa fa-remove"></li>
	</button>
	<h4 class="modal-title">添加地图</h4>
</div>

<div class="modal-body">
	<input type="hidden" id="id" name="id" value="${id}" /> 
	<div class="row">
		<div id="container" style="width: 100%; height: 500px;"></div>
	</div>
	<div class="row">
		<div class="box-footer">
			<div class="pull-right">
				<button id="bt5" type="button" class="btn btn-default" data-btn-type="save_marker" onclick="addMarker();"> 
					<i class="fa fa-save"></i> 保存标点
				</button>
			</div>
			<div class="pull-right">
				<button id="bt4" type="button" class="btn btn-default" data-btn-type="cancel_marker">
					<i class="fa fa-reply"></i> 取消标点
				</button>
			</div>
			<div class="pull-right">
				<button id="bt3" type="button" class="btn btn-default" data-btn-type="add_org">
					<i class="fa fa-plus-square"></i> 添加基地
				</button>
			</div>
			<div class="pull-right">
				<button id="bt2" type="button" class="btn btn-default" data-btn-type="add_camera">
					<i class="fa fa-puzzle-piece"></i> 添加摄像头
				</button>
			</div>
			<div class="pull-right">
				<button id="bt1" type="button" class="btn btn-default" data-btn-type="add_device">
					<i class="fa fa-plus-square-o"></i> 添加采集器
				</button>
			</div>
		</div>
	</div>
</div>


<script src="http://webapi.amap.com/maps?v=1.4.6&key=5dbb4532636218635d869311007581c9&callback=init"></script>
<script>
	var clickListener, map;
	var marker = [];
	function init() {
		clickListener, map = new AMap.Map('container', {
			resizeEnable : true,
			zoom : 12
		});
		map.plugin([ "AMap.ToolBar" ], function() {
			map.addControl(new AMap.ToolBar());
		});

		var bindDevice = function() {
	        remove(); //防止重复绑定
	        clickListener = AMap.event.addListener(map, "click", function(e) {
	        	console.info(e.lnglat);
				new AMap.Marker({
					position: e.lnglat,
					icon: 'http://webapi.amap.com/theme/v1.3/markers/n/mark_b1.png',
					map: map
				});
				var mk=new Object();
				mk.type="采集器";
				mk.lng=e.lnglat.lng;
				mk.lat=e.lnglat.lat;
				marker.push(mk);
			});
	    };
	    
	    var bindCamera = function() {
	        remove(); //防止重复绑定
	        clickListener = AMap.event.addListener(map, "click", function(e) {
				new AMap.Marker({
					position: e.lnglat,
					icon: 'http://webapi.amap.com/theme/v1.3/markers/n/mark_b2.png',
					map: map
				});
				var mk=new Object();
				mk.type="设备";
				mk.lng=e.lnglat.lng;
				mk.lat=e.lnglat.lat;
				marker.push(mk);
			});
	    };
	    
	    var bindOrg = function() {
	        remove(); //防止重复绑定
	        clickListener = AMap.event.addListener(map, "click", function(e) {
				new AMap.Marker({
					position: e.lnglat,
					icon: 'http://webapi.amap.com/theme/v1.3/markers/n/mark_b3.png',
					map: map
				});
				var mk=new Object();
				mk.type="基地";
				mk.lng=e.lnglat.lng;
				mk.lat=e.lnglat.lat;
				marker.push(mk);
			});
	    };
	    
		//bt2的click的绑定事件
	    var remove = function() {
	        if (clickListener) {
	            AMap.event.removeListener(clickListener);//移除事件，以绑定时返回的对象作为参数
	        }
	    };   
		var button1 = document.getElementById('bt1');
	    var listener1 = AMap.event.addDomListener(button1, 'click', bindDevice);//给div绑定单击事件  
	    var button2 = document.getElementById('bt2');
	    var listener2 = AMap.event.addDomListener(button2, 'click', bindCamera);//给div绑定单击事件
	    var button3 = document.getElementById('bt3');
	    var listener3 = AMap.event.addDomListener(button3, 'click', bindOrg);//给div绑定单击事件
	    var button4 = document.getElementById('bt4');
	    var listener4 = AMap.event.addDomListener(button4, 'click', remove);//给div绑定单击事件	
	}
	

	function addMarker(){
		var orgId = $("#id").val();
		ajaxPost(basePath+'/scene/saveMap/'+orgId,{"marker":JSON.stringify(marker), "mapCenter":JSON.stringify(map.getCenter()), "mapZoom":map.getZoom()}, function(data) {
            if(data.success){
            	modals.closeWin('addMap');
            }else{
				modals.error(data.message);
			}
        });
	}
</script>